<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>红色路线-首页</title>
    <link rel="stylesheet" href="./css/redline_1/redline_index.css">
</head>
<body>
<div class="container">
    <!--顶部固定区域-->
    <header class="top">
        <div class="top-in clearfix">
            <div class="img1 fl">
                <img src="./imgs/redline_1/icon-close.png" alt="close">
            </div>

            <h2 class="fl">旅游线路</h2>

            <div class="img2 fr">
                <img src="./imgs/redline_1/icon-more.png" alt="">
            </div>
        </div>
    </header>

    <!--内容区域-->

    <section class="content">
        <div class="content-in">
            <!--菜单区域-->
            <nav class="menu">
                <ul class="menu-list">
                    <li class="active">
                        <a href="#">红<span>色线</span>路</a>

                    </li>
                    <li>
                        <a href="#">党<span>政学</span>习</a>

                    </li>
                    <li>
                        <a href="#"> 公<span>益旅</span>游</a>

                    </li>
                    <li>
                        <a href="#">旅<span>游康</span>养</a>

                    </li>
                </ul>
            </nav>
            <!--轮播区域-->
            <div class="banner">
                <img src="./imgs/redline_1/banner@2x.png" alt="旅游自在行">
            </div>
            <!--内容-->
            <article class="line">
                <ul class="line-list">
                    <li>
                        <a href="particulars.html" class="tu">
                            <img src="./imgs/redline_1/line1.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                    <li>
                        <a href="#" class="tu">
                            <img src="./imgs/redline_1/line2.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                    <li>
                        <a href="#" class="tu">
                            <img src="./imgs/redline_1/line3.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                    <li>
                        <a href="#" class="tu">
                            <img src="./imgs/redline_1/line4.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>

                    <li>
                        <a href="#" class="tu">
                            <img src="./imgs/redline_1/line5.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                    <li>
                        <a href="#" class="tu">
                            <img src="./imgs/redline_1/line6.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                    <li>
                        <a href="#" class="tu">
                            <img src="./imgs/redline_1/line7.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                    <li>
                        <a href="confirm_order1.html" class="tu">
                            <img src="./imgs/redline_1/line8.jpg" alt="红色线路">
                        </a>
                        <h3>漫游九寨沟好安逸的名字 大家快来呀...</h3>
                        <p>
                            <span class="price">￥1258 </span>
                            <span class="count">已99人出游</span>
                        </p>
                    </li>
                </ul>
            </article>
        </div>

    </section>

    <!--底部固定区域-->
    <footer class="foot">
        <div class="foot-in">
            <a href="SpecialMall.html" class="active">
                <img src="./imgs/redline_1/icon-index_red.png" alt="首页">
                <span>首页</span>
            </a>
            <a href="#">
                <img src="./imgs/redline_1/icon-shop.png" alt="购物车">
                <span>购物车</span>
            </a>
            <a href="#">
                <img src="./imgs/redline_1/icon-order.png" alt="订单">
                <span>订单</span>
            </a>
            <a href="homepage.html">
                <img src="./imgs/redline_1/icon-user.png" alt="我的">
                <span>我的</span>
            </a>
        </div>
    </footer>
</div>
</body>
</html>